<template>
  <div class="scrollbar">
   <div class="scroll-item" v-for="item in list" :key="item.value">{{item.label}}</div>
  </div>
</template>

<script>
import { getCurrentInstance, onMounted, reactive, toRefs } from 'vue'
export default {
  props:{
    list:{
      type:Array,
      default(){
        return [
          {
            label:'选项一',
            value:'1'
          },{
            label:'比较长的选项',
            value:'2'
          }
        ]
      }
    },
    color:{
      type:String,
      default:'#5FB878'
    }
  },
  setup(){
    const pageInstance = getCurrentInstance()
    const _data =reactive({
      scroll:null
    })
    onMounted(()=>{
      console.log(pageInstance);
    })
  
    return {
      ...toRefs(_data)
    }
  }
}
</script>

<style lang="scss" scoped>
.scrollbar{
  width: 100%;
}
</style>